<template>
  <div class="render-paner">
    <CPRender
      :cpr="cpr"
      :properts="properts"
      :layout="layout"
      :events="events"
      :resource="resource"
      :theme="theme"
      :childComponents="childComponents"
      :value="properts"
      ref="render">
    </CPRender>
  </div>
</template>

<script>
import { strer } from '@daelui/dogjs/dist/components'
import CPRender from './components/cprender.vue'
import stock from '../../../service/stock/index'
import layoutCollection from './components/layouts'
import componentCollection from './components/components'

export default {
  components: {
    CPRender
  },

  props: {
    stock: {
      type: Object,
      default () {
        return stock
      }
    }
  },

  data () {
    return {
      cpr: {
        component: 'div',
        isProperty: false
      },
      properts: {},
      layout: {},
      events: {},
      resource: {},
      theme: {},
      childComponents: []
    }
  },

  watch: {
    'stock.state.page': {
      handler () {
        this.updateRender()
      },
      deep: true
    }
  },

  methods: {
    // 初始化
    init () {
      this.stock.setter.setLayoutCollection(layoutCollection)
      this.stock.setter.setComponentCollection(componentCollection)
    },
    // 设置布局列表
    setLayoutCollection (list) {
      this.stock.setter.setLayoutCollection(list)
    },
    // 设置组件列表
    setComponentCollection (list) {
      this.stock.setter.setComponentCollection(list)
    },
    // 设置页面数据
    setPageState (page) {
      this.stock.state.page = page
    },
    // 更新视图
    updateRender () {
      let page = this.stock.state.page
      if (!page.id) {
        return false
      }
      let meta = page.meta
      meta.id = meta.id || strer.utid()
      this.cpr.name = meta.name || page.layout
      this.cpr.version = meta.version
      this.properts = meta.properts
      this.layout = meta.layout
      this.events = meta.events
      this.resource = meta.resource
      this.theme = meta.theme
      this.childComponents = meta.childComponents
    },
    // 获取元数据
    getMetaValue () {
      return this.$refs.render.$refs.view.getMetaValue()
    },

    /**
     * @function 更新视图
    */
    updateView () {
      return this.$refs.render.$refs.view.updateView()
    }
  },

  mounted() {
    this.init()
    this.updateRender()
  }
}
</script>

<style lang="less">
.render-paner {
  height: 100%;
}
</style>
